<template>
  <div id="reportRulesPoct">
    <Breadcrumb :content="content"></Breadcrumb>
    <div class="bodyContent">
      <Splitpanes>
        <Pane size="13">
          <div class="smallToolTitle">报告单元</div>
          <el-scrollbar style="height:calc(100% - 30px)">
            <el-tree :expand-on-click-node="false" :default-expand-all="true" :data="reportTypeList" :props="defaultProps" node-key="id" ref="dataTreeRef" highlight-current class="tools-tree" @node-click="handleClickType" :current-node-key="currentTreeId" v-loading="treeloading">
              <template #default="{ data }">
                <span>{{ data.rptGroupName }}</span>
              </template>
            </el-tree>
          </el-scrollbar>
        </Pane>

        <Pane size="87">
          <el-scrollbar height="100%">
            <el-tabs type="border-card">
              <el-tab-pane label="常规报告设置">
                <el-scrollbar height="100%">
                  <!-- 报告一 -->
                  <div class="rightTopPane topBox">
                    <el-drawer v-model="drawer" show-close title="报告报告属性" :with-header="false" @close="drawerClose">
                      <ReportAttribute ref="refReport" />
                    </el-drawer>
                    <el-tag size="small" @mousedown="startPress(1)" @mouseup="endPress" @mouseleave="cancelPress">报告格式一</el-tag>
                    <div class="spacer">
                      <div>
                        <VxePulldownSelectionReport ref="VxePulldownSelectionReport1" :isChild="false" @selectedSaveValue="selectedSaveValue" sourceMark="1" :url="'/api/pubReport/getReportByCommonId'" :dataObj="commonIdData" @confirmClick="selectchange1" @focusEvent="focusEvent(1)" :tableColumn="[
                          { field: 'code', title: '编码' ,width:'100px'},
                          { field: 'name', title: '名称' },
                          { field: 'rptGroups', title: '被哪些报告单元应用' }
                        ]" :aimKeys="[
                          { targetField: 'reportId', sourceField: 'id' },
                          { targetField: 'report', sourceField: 'entity' }
                        ]" :displayTexts="['name']" :displayTextObj="form.reportName1 ? form.reportName1 : ''" />
                      </div>&nbsp;
                      <vxe-button type="text" class="button-blue" content="报告预览"></vxe-button>
                    </div>
                  </div>

                  <!-- 报告二 -->
                  <div class="rightTopPane centerBox">
                    <el-tag @mousedown="startPress(2)" @mouseup="endPress" @mouseleave="cancelPress" size="small">报告格式二</el-tag>
                    <div class="spacer">
                      <VxePulldownSelectionReport ref="VxePulldownSelectionReport2" :isChild="false" sourceMark="2" :url="'/api/pubReport/getReportByCommonId'" :dataObj="commonIdData" @focusEvent="focusEvent(2)" @selectedSaveValue="selectedSaveValue" @confirmClick="selectchange2" :tableColumn="[
                        { field: 'code', title: '编码' ,width:'100px'},
                        { field: 'name', title: '名称' },
                        { field: 'rptGroups', title: '被哪些报告单元应用' }
                      ]" :aimKeys="[
                        { targetField: 'reportId', sourceField: 'id' },
                        { targetField: 'report', sourceField: 'entity' }
                      ]" :displayTexts="['name']" :displayTextObj="form.reportName2 ? form.reportName2 : ''" />
                      &nbsp;
                      <vxe-button @click="showPaneHandler('0')" type="text" class="button-blue" content="项目设置"></vxe-button>
                      <span style="color: rgb(180, 28, 28)">项目超过</span>
                      <vxe-input type="number" size="mini" :min="0" v-model="form.rules2" @click="save"></vxe-input>
                      <span style="color: rgb(180, 28, 28)">项时使用 或包含以下项目使用</span>
                    </div>

                    <Splitpanes>
                      <Pane :size="showPane === false ? 100 : 60" class="transitionPane">
                        <el-scrollbar>
                          <NoData v-if="selectDictItem.length === 0" :msg="'暂无数据'" class="reportTwoNodata"></NoData>
                          <div v-for="(dictItem, mindex) in selectDictItem" :key="mindex" style="display: inline-block">
                            <el-tag class="margin-left-xs tagBox tagboxborder" effect="plain" style="margin-bottom: 10px">
                              {{ dictItem.itemNa }}
                              <el-icon class="tagicon" @click="dbSelectDictItem(dictItem)">
                                <Close style="color: #27b46b" />
                              </el-icon>
                            </el-tag>
                          </div>
                        </el-scrollbar>
                      </Pane>
                      <el-dialog :title="title" :show-close="false" v-model="showDialog" append-to-body width="1000px" :close-on-click-modal="false" destroy-on-close v-if="showDialog">
                        <div class="tableBody" style="height: 600px">
                          <vxe-table ref="labItemTableRef" class="mytable-scrollbar" border height="auto" align="center" :data="showPanelTypeObj=='0'?itemList:showPanelTypeObj==='1'?itemListFore:[]" :loading="lloading" :row-config="{ keyField: 'id', isHover: true }" :column-config="{ resizable: true }" :checkbox-config="{
                            checkMethod: checCheckboxkMethod2,
                            visibleMethod: showCheckboxkMethod2,
                            checkRowKeys: defaultSelecteRowKeys
                          }" resizable show-overflow :scroll-y="{ enabled:true }">
                            <vxe-column type="checkbox" width="30px"></vxe-column>
                            <vxe-column title="序号" width="80">
                              <template #default="{ rowIndex }">
                                <span>{{ rowIndex + 1 }}</span>
                              </template>
                            </vxe-column>
                            <vxe-column field="itemNo" title="编码"></vxe-column>
                            <vxe-column field="itemNa" title="项目名称"></vxe-column>
                          </vxe-table>
                          <div class="dialog-footer flex right justify-end padding-bottom-sm" style="margin: 10px;">
                            <el-button type="primary" @click="saveRuleVsItemDict">确定</el-button>
                            <el-button @click="closeDialog">取消</el-button>
                          </div>
                        </div>
                      </el-dialog>
                    </Splitpanes>
                  </div>

                  <!-- 报告三 -->
                  <div class="rightTopPane bottomBox">
                    <el-tag @mousedown="startPress(3)" @mouseup="endPress" @mouseleave="cancelPress" size="small">报告格式三</el-tag>
                    <div class="spacer">
                      <VxePulldownSelectionReport ref="VxePulldownSelectionReport3" :isChild="false" @selectedSaveValue="selectedSaveValue" sourceMark="3" :url="'/api/pubReport/getReportByCommonId'" :dataObj="commonIdData" @focusEvent="focusEvent(3)" @confirmClick="selectchange3" :tableColumn="[
                        { field: 'code', title: '编码' ,width:'100px'},
                        { field: 'name', title: '名称' },
                        { field: 'rptGroups', title: '被哪些报告单元应用' }
                      ]" :aimKeys="[
                        { targetField: 'reportId', sourceField: 'id' },
                        { targetField: 'report', sourceField: 'entity' }
                      ]" :displayTexts="['name']" :displayTextObj="form.reportName3 ? form.reportName3 : ''" />
                      &nbsp;
                      <vxe-button type="text" class="button-blue" content="报告预览"></vxe-button>
                      <span style="color: rgb(180, 28, 28)">项目超过</span>
                      <vxe-input type="number" size="mini" :min="0" v-model="form.rules3" @click="save"></vxe-input>
                      <span style="color: rgb(180, 28, 28)">项时使用</span>
                    </div>
                  </div>

                  <!-- 报告四 -->
                  <div class="rightTopPane belowBox">
                    <div>
                      <el-tag @mousedown="startPress(4)" @mouseup="endPress" @mouseleave="cancelPress" size="small">
                        <template #default>
                          <span>报告格式四</span>
                        </template>
                      </el-tag>
                      <span class="margin-left text-blod">
                        <el-checkbox v-model="form.isSplit" label="是否拆分" size="small" :true-label="'1'" :false-label="'0'" @change="isSplitChange" />
                      </span>
                      <el-tooltip class="margin-left tool-tip-box" :raw-content="true" effect="light" placement="top" title="拆分解释" :width="200" trigger="hover" content="">
                        <template #content>
                          <span>勾选拆分,所选项目拆分到规则四模板中出报告,其他项目按规则设置出报告;</span>
                          <span>不勾选，结果中任一项目包含在规则四所选项目中则报告单使用规则四的模板出报告,其他规则不再启用。</span>
                        </template>
                        <el-icon class="margin-left">
                          <QuestionFilled />
                        </el-icon>
                      </el-tooltip>
                    </div>
                    <div class="spacer">
                      <VxePulldownSelectionReport ref="VxePulldownSelectionReport4" :isChild="false" @selectedSaveValue="selectedSaveValue" sourceMark="4" :url="'/api/pubReport/getReportByCommonId'" :dataObj="commonIdData" @focusEvent="focusEvent(4)" @confirmClick="selectchange4" :tableColumn="[
                        { field: 'code', title: '编码' ,width:'100px'},
                        { field: 'name', title: '名称' },
                        { field: 'rptGroups', title: '被哪些报告单元应用' }
                      ]" :aimKeys="[
                        { targetField: 'reportId', sourceField: 'id' },
                        { targetField: 'report', sourceField: 'entity' }
                      ]" :displayTexts="['name']" :displayTextObj="form.reportName4 ? form.reportName4 : ''" />
                      &nbsp;
                      <vxe-button @click="showPaneHandler('1')" type="text" class="button-blue" content="项目设置"></vxe-button>
                      <span style="color: rgb(180, 28, 28)">以下项目使用，其他项目按报告模版中设置打印</span>
                    </div>

                    <Splitpanes>
                      <Pane :size="showPane === false ? 100 : 30" class="transitionPane">
                        <el-scrollbar>
                          <NoData v-if="selectDictItemRuleFore.length === 0" :msg="'暂无数据'"></NoData>
                          <div v-for="(dictItem, mindex) in selectDictItemRuleFore" :key="mindex" style="display: inline-block">
                            <el-tag class="margin-left-xs tagBox tagboxborder" effect="plain" style="margin-bottom: 10px">
                              {{ dictItem.itemNa }}
                              <el-icon class="tagicon" @click="deleteSelectDictItemFore(dictItem)">
                                <Close style="color: #27b46b" />
                              </el-icon>
                            </el-tag>
                          </div>
                        </el-scrollbar>
                      </Pane>
                    </Splitpanes>
                  </div>
                  <!-- 保存 -->
                  <div class="margin-top-sm padding-bottom-sm margin-left-sm">
                    <vxe-button type="text" icon="vxe-icon-save" class="button-blue saveButton" content="保存" @click="save()"></vxe-button>
                  </div>
                </el-scrollbar>
              </el-tab-pane>
              <el-tab-pane label="特殊报告设置">
                <ReportRulesSpecial ref="reportRulesSpecial" />
              </el-tab-pane>
              <el-tab-pane label="操作日志">
                <LogInfo requestUrl="/api/task/"></LogInfo>
              </el-tab-pane>
            </el-tabs>
          </el-scrollbar>
        </Pane>
      </Splitpanes>
    </div>
  </div>
</template>
<script setup lang="ts">
// 公共组件标题
const content = ref('报告单设置');
import { ref, reactive, getCurrentInstance, watch, onMounted, nextTick } from 'vue';
import { Splitpanes, Pane } from 'splitpanes';
import { pageSizes, notifyType, notifyMessage, IsEmpty } from '@/utils/common';
import Breadcrumb from '@/components/Breadcrumb.vue';
import { VxeTablePropTypes } from 'vxe-table';
import { ElMessage, ElMessageBox } from 'element-plus';
import 'splitpanes/dist/splitpanes.css';
import { VXETable } from 'vxe-table';
import XEUtils from 'xe-utils';
import { VxeMessage, VxeNotifyType } from '@/utils/CommonMessage';
import { AppStore } from '@/stores/store';
import axios from 'axios';
import ReportRulesSpecial from '../system_set/ReportRulesSpecial.vue'; //仪器报表
import LogInfo from '@/components/LogInfo.vue'; //日志
import ReportAttribute from '../system_set/ReportAttribute.vue'; //属性设置
import VxePulldownSelectionReport from '@/components/VxePulldownSelectionReport.vue';
import NoData from '@/components/NoData.vue';

let reportRulesSpecial: any = ref(null); //特殊规则ref

let store = AppStore();
let conHeight = ref(document.documentElement.clientHeight || document.body.clientHeight);
let defaultProps = {
  children: 'children',
  label: 'title'
};
let title = ref('');
// 展开隐藏页面按钮文字1
let showPane = ref(false);
let treeloading = ref(false);
let drawer = ref(false);
let showDialog = ref(false);
let lloading = ref(false); //弹框表格数据加载状态
let currentTreeId = ref(''); // 当前树选中行的id
let currentTreeNodes = reactive([]); // 当前树选中行
let businessType = '';
let rule4IsSplit = ref(true);/**规则4是否差分 */
let pressTimer = ref(null);  // 用于存储定时器
const longPressThreshold = ref(4000); // 长按时间阈值，单位为毫秒
let deleteRuleFlag = ref(-1);/* 要删除的规则索引 */
let curTreeNodeSelected = reactive({});/* 当前选中的报告单元 */
onMounted(() => {
  businessType = proxy.$route.query.businessType;
  getReportTypeList();
  //getReportItemList();
  //getReportItemListFore();
  const firstPane = document.querySelector('.firstPaneBox');
  const parentElement = firstPane?.parentElement;
  const splitter = parentElement?.querySelector('.splitpanes__splitter') as HTMLElement;
  if (splitter) {
    splitter.style.visibility = 'hidden';
  }
});

let refReport: any = ref(null);
//获取当前点击的报告Id
let commonIdData = reactive({ commonId: '00' });

const size = ref('');
let { proxy }: any = getCurrentInstance();
let form = reactive({
  id: null,
  searchValue: '',
  code: '',
  searchValueMoulde: '',
  name: '',
  paperSize: '',
  type: '0',
  reportName1: '',
  reportName2: '',
  reportName3: '',
  reportName4: '',
  reportRulesId: '',
  itemDictId: '',
  seq: 0,
  reportId1: '',
  reportId2: '',
  reportId3: '',
  reportId4: '',
  reportCode1: '',
  reportCode2: '',
  reportCode3: '',
  reportCode4: '',
  ruleOneId: '', //规则1
  ruleTwoId: '', //规则2
  ruleThreeId: '', //规则3
  ruleForeId: '', //规则4
  reportGroupId: '', //报告单元
  rptGroup: '', //报告单元
  reportGroupName: '', //报告单元名称
  rules2: 0,
  rules3: 0,
  ruleType: '', //规则标识
  commonId: '',
  isSplit: '1'
});

let commonId = '';

//选中的报表
let reportForm1 = reactive({
  id: '',
  reportCode: '',
  name: ''
});
let reportForm2 = reactive({
  id: '',
  reportCode: '',
  name: ''
});
let reportForm3 = reactive({
  id: '',
  reportCode: '',
  name: ''
});
let reportForm4 = reactive({
  id: '',
  reportCode: '',
  name: ''
});
let reportRuleList: any = reactive([]);
let itemList: any = reactive([]);
let reportTypeList: any = reactive([]);
//获取报告单元集合
function getReportTypeList() {
  reportTypeList.length = 0;
  const url = '/api/pub/reportRules/getReportGroupPoct';
  proxy.$http
    .get(url, {
      params: { businessType: businessType }
    })
    .then((res: any) => {
      reportTypeList.push(...res.data);
      if (reportTypeList.length > 0) {
        const firstId = reportTypeList[0].id; //树id
        const selectNodes = reportTypeList[0]; //树节点
        currentTreeId.value = firstId;
        currentTreeNodes = selectNodes;
        proxy.$nextTick(() => {
          proxy.$refs.dataTreeRef.setCurrentKey(currentTreeId.value);
          handleClickType(currentTreeNodes);
        });
      }
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}
//弹框取消
function closeDialog() {
  showDialog.value = false;
}

//对于母模版选中之后弹出另存为界面，执行保存后返回子组件传来的值并赋值给当前操作的下拉列表
function selectedSaveValue(reportObject: any, typeValue: number) {
  if (typeValue === 1 || typeValue === '1') {
    form.reportId1 = reportObject.id;
    form.reportName1 = reportObject.name;
    updateReportRuleByRuleId1(reportObject.code);
  }
  if (typeValue === 2 || typeValue === '2') {
    form.reportId2 = reportObject.id;
    form.reportName2 = reportObject.name;
    updateReportRuleByRuleId2(reportObject.code);
  }
  if (typeValue === 3 || typeValue === '3') {
    form.reportId3 = reportObject.id;
    form.reportName3 = reportObject.name;
    updateReportRuleByRuleId3(reportObject.code);
  }
  if (typeValue === 4 || typeValue === '4') {
    form.reportId4 = reportObject.id;
    form.reportName4 = reportObject.name;
    updateReportRuleByRuleId4(reportObject.code);
  }
}

let showPaneType = '';
let showPanelTypeObj = ref('');
// 控制页面显示隐藏
function showPaneHandler(type: String) {
  if (type === '0') {
    title.value = '规则二选择报告项目';
    getReportItemList();
  }
  if (type === '1') {
    title.value = '规则四选择报告项目';
    getReportItemListFore();
  }
  showPanelTypeObj.value = type;
  showPaneType = type;
  showDialog.value = true;
}

// 获取焦点显示抽屉
function focusEvent(val) {
  if (val === 1) {
    if (reportForm1.reportCode === null || reportForm1.reportCode === '') {
      VxeMessage('请选择报告格式模版', 'error');
      return;
    }
  } else if (val === 2) {
    if (reportForm2.reportCode === null || reportForm2.reportCode === '') {
      VxeMessage('请选择报告格式模版', 'error');
      return;
    }
  } else if (val === 3) {
    if (reportForm3.reportCode === null || reportForm3.reportCode === '') {
      VxeMessage('请选择报告格式模版', 'error');
      return;
    }
  } else if (val === 4) {
    if (reportForm4.reportCode === null || reportForm4.reportCode === '') {
      VxeMessage('请选择报告格式模版', 'error');
      return;
    }
  }
  setTimeout(() => {
    if (val === 1) {
      refReport.value.initPage(reportForm1);
    } else if (val === 2) {
      refReport.value.initPage(reportForm2);
    } else if (val === 3) {
      refReport.value.initPage(reportForm3);
    } else if (val === 4) {
      refReport.value.initPage(reportForm4);
    }
  }, 500);

  drawer.value = val;
}
//规则一下拉选择
function selectchange1(e) {
  if (e !== null) {
    reportForm1.id = e.row.entity.id;
    reportForm1.name = e.row.entity.name;
    form.reportId1 = e.row.entity.id;
    form.reportCode1 = e.row.entity.code;
    form.reportName1 = e.row.entity.name;
    updateReportRuleByRuleId1(e.row.entity.code);
  }
}

// 关闭抽屉事件
function drawerClose() {
  proxy.$refs.VxePulldownSelectionReport1.SourceMarkReset();
  proxy.$refs.VxePulldownSelectionReport2.SourceMarkReset();
  proxy.$refs.VxePulldownSelectionReport3.SourceMarkReset();
  proxy.$refs.VxePulldownSelectionReport4.SourceMarkReset();
}

function updateReportRuleByRuleId1(reportCode: String) {
  const data = {
    reportRulesId: form.ruleOneId,
    reportCode1: reportCode,
    reportId1: form.reportId1,
    rptGroup: form.rptGroup,
    reportGroupName: form.reportGroupName
  };
  const url = '/api/pub/updateReportRuleByRuleId1';
  proxy.$http
    .post(url, data)
    .then((res) => {
      form.ruleOneId = res.data;
    })
    .catch((err) => {
      ElMessage({
        message: '数据异常',
        type: 'error'
      });
    });
}

function selectchange2(e) {
  if (e !== null) {
    reportForm2.id = e.row.entity.id;
    reportForm2.name = e.row.entity.name;
    form.reportId2 = e.row.entity.id;
    form.reportCode2 = e.row.entity.code;
    form.reportName2 = e.row.entity.name;
    updateReportRuleByRuleId2(e.row.entity.code);
  }
}

function updateReportRuleByRuleId2(reportCode: String) {
  const data = {
    reportRulesId: form.ruleTwoId,
    reportCode2: reportCode,
    reportId2: form.reportId2,
    rptGroup: form.rptGroup,
    reportGroupName: form.reportGroupName
  };
  const url = '/api/pub/updateReportRuleByRuleId2';
  proxy.$http
    .post(url, data)
    .then((res) => {
      form.ruleTwoId = res.data;
    })
    .catch((err) => {
      ElMessage({
        message: '数据异常',
        type: 'error'
      });
    });
}

//下拉规则三触发方法
function selectchange3(e) {
  if (e !== null) {
    reportForm3.id = e.row.entity.id;
    reportForm3.name = e.row.entity.name;
    form.reportId3 = e.row.entity.id;
    form.reportCode3 = e.row.entity.code;
    form.reportName3 = e.row.entity.name;
    updateReportRuleByRuleId3(e.row.entity.code);
  }
}

function updateReportRuleByRuleId3(reportCode: String) {
  const data = {
    reportRulesId: form.ruleThreeId,
    reportCode3: reportCode,
    reportId3: form.reportId3,
    rptGroup: form.rptGroup,
    reportGroupName: form.reportGroupName
  };
  const url = '/api/pub/updateReportRuleByRuleId3';
  proxy.$http
    .post(url, data)
    .then((res) => {
      form.ruleThreeId = res.data;
    })
    .catch((err) => {
      ElMessage({
        message: '数据异常',
        type: 'error'
      });
    });
}

//下拉规则四
function selectchange4(e) {
  if (e !== null) {
    reportForm4.id = e.row.entity.id;
    reportForm4.name = e.row.entity.name;
    form.reportId4 = e.row.entity.id;
    form.reportCode4 = e.row.entity.code;
    form.reportName4 = e.row.entity.name;
    //form.ruleOneId = e.row.entity.id;
    //form.ruleForeId = e.row.entity.id;
    updateReportRuleByRuleId4(e.row.entity.code);
  }
}
/* 是否拆分复选框选择时间改变 */
function isSplitChange(e) {
  if (IsEmpty(form.reportId4) || IsEmpty(form.reportCode4)) {
    VxeMessage('请选择规则四报告格式模版', VxeNotifyType.error);
    return;
  }
  updateReportRuleByRuleId4(form.reportCode4);
}
function updateReportRuleByRuleId4(reportCode: String) {
  const data = {
    reportRulesId: form.ruleForeId,
    reportCode4: reportCode,
    reportId4: form.reportId4,
    rptGroup: form.rptGroup,
    reportGroupName: form.reportGroupName,
    isSplit: form.isSplit
  };
  const url = '/api/pub/updateReportRuleByRuleId4';
  proxy.$http
    .post(url, data)
    .then((res) => {
      form.ruleForeId = res.data;
    })
    .catch((err) => {
      ElMessage({
        message: '数据异常',
        type: 'error'
      });
    });
}

function formClean() {
  form.reportName1 = '';
  form.reportName2 = '';
  form.reportName3 = '';
  form.reportName4 = '';

  form.reportId1 = '';
  form.reportId2 = '';
  form.reportId3 = '';
  form.reportId4 = '';
  form.ruleType = '';

  form.ruleOneId = ''; //规则1
  form.ruleTwoId = ''; //规则2
  form.ruleThreeId = ''; //规则3
  form.ruleForeId = ''; //规则4
  form.rules2 = 0;
  form.rules3 = 0;
  reportForm1.id = '';
  reportForm1.name = '';
  reportForm2.id = '';
  reportForm2.name = '';
  reportForm3.id = '';
  reportForm3.name = '';
  reportForm4.id = '';
  reportForm4.name = '';
}

//点击报告单元获取规则
function handleClickType(node: any) {
  proxy.$nextTick(() => {
    formClean();
  });
  reportRuleList.length = 0;
  Object.assign(curTreeNodeSelected, node);
  form.reportGroupId = node.id;
  form.rptGroup = node.rptGroup;
  form.reportGroupName = node.rptGroupName; //报告单元名称
  form.commonId = node.workGroup;
  commonId = node.workGroup;
  commonIdData.commonId = commonId;
  reportRulesSpecial.value?.initPageInfo(form); //传递给右侧基本信息表单
  const url = '/api/pub/reportRules/getReportRulesByGroupId/' + form.rptGroup;
  proxy.$http
    .get(url)
    .then((res: any) => {
      reportRuleList.push(...res.data); //当前规则列表
      form.id = '';
      form.ruleOneId = '';
      form.ruleTwoId = '';
      form.ruleThreeId = '';
      form.ruleForeId = '';
      if (reportRuleList.length > 0) {
        reportRuleList.forEach((item) => {
          if (item.ruleType !== '' && item.ruleType === '1') {
            //规则1
            form.reportName1 = item.reportName;
            form.reportId1 = item.reportId;
            form.reportCode1 = item.reportCode;
            form.ruleOneId = item.id;
            form.id = item.id;
            reportForm1.id = item.reportId;
            reportForm1.reportCode = item.reportCode;
            reportForm1.name = item.reportName;
            form.isSplit = IsEmpty(item.isSplit) ? '0' : '1';
          }
          if (item.ruleType !== '' && item.ruleType === '2') {
            //规则2
            form.reportName2 = item.reportName;
            form.reportId2 = item.reportId;
            form.reportCode2 = item.reportCode;
            form.ruleTwoId = item.id; //规则2
            form.rules2 = item.rules;
            form.id = item.id;
            reportForm2.id = item.reportId;
            reportForm2.reportCode = item.reportCode;
            reportForm2.name = item.reportName;
            form.isSplit = IsEmpty(item.isSplit) ? '0' : '1';
          }
          if (item.ruleType !== '' && item.ruleType === '3') {
            //规则3
            form.reportName3 = item.reportName;
            form.reportId3 = item.reportId;
            form.reportCode3 = item.reportCode;
            form.ruleThreeId = item.id; //规则3
            form.rules3 = item.rules;
            form.id = item.id;
            reportForm3.id = item.reportId;
            reportForm3.reportCode = item.reportCode;
            reportForm3.name = item.reportName;
            form.isSplit = IsEmpty(item.isSplit) ? '0' : '1';
          }
          if (item.ruleType !== '' && item.ruleType === '4') {
            //规则4
            form.reportName4 = item.reportName;
            form.reportId4 = item.reportId;
            form.reportCode4 = item.reportCode;
            form.ruleForeId = item.id; //规则4
            form.id = item.id;
            reportForm4.id = item.reportId;
            reportForm4.reportCode = item.reportCode;
            reportForm4.name = item.reportName;
            form.isSplit = IsEmpty(item.isSplit) ? '0' : '1';
          }
        });
      }

      findDictItemByRules(); //刷新规则二中选中的项目列表
      // getReportItemList();//刷新规则二中没有选中的报告项目
      findDictItemByRuleFore(); //刷新规则四中选中的项目列表
      //getReportItemListFore();//刷新规则四中没有选中的报告项目
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}

//点击弹框中的保存按钮
function saveRuleVsItemDict() {
  let reportRulesId = '';
  if (showPaneType === '0') {
    //规则2数据处理
    form.ruleType = '2';
    reportRulesId = form.ruleTwoId;
    form.reportRulesId = form.ruleTwoId;
    if (IsEmpty(form.reportCode2)) {
      VxeMessage('请选择规则二报告格式模版', 'error');
      return;
    }
  }
  if (showPaneType === '1') {
    //规则4数据处理
    form.ruleType = '4';
    reportRulesId = form.ruleForeId;
    form.reportRulesId = form.ruleForeId;
    if (IsEmpty(form.reportCode4)) {
      VxeMessage('请选择规则四报告格式模版', 'error');
      return;
    }
  }

  const selectRows = (proxy.$refs.labItemTableRef as any).getCheckboxRecords();
  if (selectRows.length > 0) {
    const addRulesVsItem = [];
    let qcitem = [];
    for (const sltRow of selectRows) {
      if (showPaneType === '0') {
        //规则2
        qcitem = selectDictItem.find((sd: any) => sd.id == sltRow.id);
      }
      if (showPaneType === '1') {
        //规则4
        qcitem = selectDictItemRuleFore.find((sd: any) => sd.id == sltRow.id);
      }

      if (IsEmpty(qcitem)) {
        const addQcItem = {
          itemDictId: sltRow.id,
          seq: sltRow.seq,
          itemDictCode: sltRow.itemNo,
          reportRulesId: reportRulesId,
          type: showPaneType
        };
        addRulesVsItem.push(addQcItem);
      }
    }
    if (addRulesVsItem.length > 0) {
      const data = { labRulesVsItemdictList: addRulesVsItem, labRulesVsItemdict: form };
      const url = '/api/pub/saveRuleVsItemDict';
      proxy.$http
        .post(url, data)
        .then((res: any) => {
          if (showPaneType === '0') {
            findDictItemByRules();
            form.ruleTwoId = res.data;
          } else if (showPaneType === '1') {
            findDictItemByRuleFore();
            form.ruleForeId = res.data;
          }

          VxeMessage(res.status.msg, VxeNotifyType.success);
        })
        .catch((err: any) => {
          VxeMessage(err, VxeNotifyType.error);
        });
    } else {
      VxeMessage('请选择要添加的数据', VxeNotifyType.error);
    }
  }
  closeDialog();
}

//规则二报告项目删除对应关系
function dbSelectDictItem(node: any) {
  const id = node.rulesVSItemDictId;
  const name = node.itemNa;
  let data = { id: id, name: name };
  const url = '/api/pub/deleleRuleVsItemDict';
  proxy.$http
    .post(url, data)
    .then((res) => {
      findDictItemByRules(); //刷新规则二中选中的项目列表
      //getReportItemList();
    })
    .catch((err) => {
      ElMessage({
        message: '数据异常',
        type: 'error'
      });
    });
}

//双击规则四右侧报告项目，插入左侧选择区域
// function dbItemDictFore({ row }) {
//   //判断报告模版是否选中
//   if (IsEmpty(form.reportId4)) {
//     VxeMessage('请选择报告格式模版', 'error');
//     return;
//   }
//   form.itemDictId = row.id;
//   form.reportRulesId = form.ruleForeId;
//   form.seq = selectDictItemRuleFore.length + 1;
//   const url = '/api/pub/saveRuleVsItemDictRuleFore';
//   proxy.$http
//     .post(url, form)
//     .then((res) => {
//       form.ruleForeId = res.data
//       findDictItemByRuleFore(); //刷新规则四中选中的项目列表
//       getReportItemListFore();
//     })
//     .catch((err) => {
//       console.log(err);
//       ElMessage({
//         message: '数据异常',
//         type: 'error'
//       });
//     });
// }
//双击规则四左侧选中的报告项目删除对应关系
function deleteSelectDictItemFore(node: any) {
  const id = node.rulesVSItemDictId;
  const name = node.itemNa;
  let data = { id: id, name: name };
  const url = '/api/pub/deleleRuleVsItemDict';
  proxy.$http
    .post(url, data)
    .then((res) => {
      findDictItemByRuleFore(); //刷新规则四中选中的项目列表
      // getReportItemListFore();
    })
    .catch((err) => {
      ElMessage({
        message: '数据异常',
        type: 'error'
      });
    });
}

/**保存 */
function save() {
  //根据规则id进行修改项目超过多少个数据
  const data = {
    ruleTwoId: form.ruleTwoId, //规则二id
    ruleThreeId: form.ruleThreeId, //规则三id
    rules2: form.rules2, //规则二数量
    rules3: form.rules3, //规则三数量
    isSplit: form.isSplit
  };
  const url = '/api/pub/rulesSave';
  proxy.$http
    .post(url, data)
    .then((res) => {
      ElMessage({
        message: '保存成功',
        type: 'success'
      });
    })
    .catch((err) => {
      ElMessage({
        message: '数据异常',
        type: 'error'
      });
    });
}

let defaultSelecteRowKeys = reactive([]);
// 弹框 表格复选框(是否允许用户手动勾选)
function checCheckboxkMethod2({ row }: any) {
  defaultSelecteRowKeys.length = 0;
  if (showPaneType === '0') {
    const obj = selectDictItem.filter((p: any) => {
      defaultSelecteRowKeys.push(p.id);
      return p.id == row.id;
    });
    return obj.length == 0;
  }

  if (showPaneType === '1') {
    const obj = selectDictItemRuleFore.filter((p: any) => {
      defaultSelecteRowKeys.push(p.id);
      return p.id == row.id;
    });
    return obj.length == 0;
  }
}

// 弹框 表格复选框 设置(是否显示复选框)
function showCheckboxkMethod2({ row }: any) {
  const obj = itemList.filter((p: any) => {
    // return p.itemDictId == row.id;
  });
  return obj.length == 0;
}

//获取规则二备选项目列表
function getReportItemList() {
  itemList.length = 0;
  const url = '/lis/lab/item/findLabItemDictList';
  const data = { params: { rptGroup: form.rptGroup } };
  proxy.$http
    .get(url, data)
    .then((res: any) => {
      itemList.push(...res.data);
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}

let itemListFore = reactive([]);
//获取规则四项目列表
function getReportItemListFore() {
  itemListFore.length = 0;
  const url = '/api/pub/findNotSelectDictItemByRules';
  const data = { params: { rulesId: form.ruleForeId } };
  proxy.$http
    .get(url, data)
    .then((res: any) => {
      itemListFore.push(...res.data);
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}

//获取规则二中选中的报告规则
let selectDictItem: any = reactive([]);
function findDictItemByRules() {
  selectDictItem.length = 0;
  if (form.ruleTwoId === null || form.ruleTwoId === '') {
    return;
  }
  const data = { params: { rulesId: form.ruleTwoId, type: '0' } };
  const url = '/api/pub/findDictItemByRules/';
  proxy.$http
    .get(url, data)
    .then((res: any) => {
      selectDictItem.push(...res.data);
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}

//获取规则四中选中的报告规则
let selectDictItemRuleFore: any = reactive([]);
function findDictItemByRuleFore() {
  selectDictItemRuleFore.length = 0;
  if (form.ruleForeId === null || form.ruleForeId === '') {
    return;
  }
  const data = { params: { rulesId: form.ruleForeId, type: '1' } };
  const url = '/api/pub/findDictItemByRules/';
  proxy.$http
    .get(url, data)
    .then((res: any) => {
      selectDictItemRuleFore.push(...res.data);
    })
    .catch((err: any) => {
      proxy.$alert(err, '提示');
    });
}
/* 删除选中规则 */
async function deleteRule() {
  let str = '';
  let id = '';
  if (deleteRuleFlag.value === 1) {
    str = '一';
    id = form.ruleOneId;
  }
  if (deleteRuleFlag.value === 2) {
    str = '二';
    id = form.ruleTwoId;
  }
  if (deleteRuleFlag.value === 3) {
    str = '三';
    id = form.ruleThreeId;
  }
  if (deleteRuleFlag.value === 4) {
    str = '四';
    id = form.ruleForeId;
  }
  const type = await VXETable.modal.confirm(`确定删除规则${str}选中的模板?`);
  if (type === 'confirm') {
    const url = '/api/pub/deleteReportRule';
    const data = { params: { Id: id } };
    proxy.$http
      .get(url, data)
      .then((res: any) => {
        handleClickType(curTreeNodeSelected);
      })
      .catch((err: any) => { })
  }
}
// 开始按下
function startPress(idnex) {
  deleteRuleFlag.value = idnex;
  pressTimer.value = setTimeout(() => {
    // 在按下超过阈值时触发长按事件
    deleteRule();
  }, longPressThreshold.value);
};

// 结束按下
function endPress() {
  clearTimeout(pressTimer.value);  // 如果松开时还没有达到长按时间，清除定时器
};

// 取消按下（例如鼠标移出）
function cancelPress() {
  clearTimeout(pressTimer.value);  // 如果按下过程中鼠标移出，清除定时器
};
</script>

<style lang="scss" scoped>
#reportRulesPoct {
  width: 100%;
  height: 100%;

  .button-blue {
    margin-left: 10px;
    margin-right: 10px;
  }

  .bodyContent {
    // 面包屑40px  上下间距10px
    height: calc(100% - 60px);

    //左侧树的标题
    .smallToolTitle {
      padding: 5px 10px;
    }
  }

  :deep(.splitpanes) {
    height: 100%;

    .splitpanes__pane {
      background-color: $base-white;
    }

    .rightTopPane {
      padding: 10px;
      box-sizing: border-box;
    }

    .topBox {
      height: 80px;
      width: 100%;
      border-bottom: 3px solid $bg-gray;
    }

    .centerBox {
      max-height: calc(100% - 190px);
      height: 280px;
      width: 100%;
      border-bottom: 3px solid $bg-gray;

      .splitpanes {
        height: calc(100% - 54px - 19px);
        .reportTwoNodata {
          height: 100%;
          span {
            top: 76%;
            transform: translate(-45%, -50%);
          }
        }
      }
    }

    .belowBox {
      //height: 300px;
      width: 100%;
      border-bottom: 3px solid $bg-gray;

      .splitpanes {
        height: calc(100% - 54px - 19px);
      }
    }

    .bottomBox {
      height: 100px;
      width: 100%;
      border-bottom: 3px solid $bg-gray;
    }

    .saveBox {
      height: 50px;
      width: 100%;
      border-bottom: 3px solid $bg-gray;
      line-height: 28px;
      padding-left: 20px;
    }

    .el-tag {
      margin-bottom: 5px;
    }
  }

  :deep(.el-scrollbar__view) {
    height: 100%;
    .el-tabs {
      height: 100%;
      border: none;

      .el-tabs__content {
        height: calc(100% - 40px);
        padding: 0;
        .el-tab-pane {
          height: 100%;
        }
      }
    }
  }

  :deep(.disabled-input-wrapper) {
    .el-input__wrapper {
      padding: 0 !important;
    }

    background-color: rgb(232, 234, 237) !important;

    /* 设置输入框的背景颜色为灰色 */
    .el-input__inner {
      background-color: rgb(232, 234, 237) !important;
      padding-left: 11px;
    }
  }

  :deep(.rulesList.vxe-table .vxe-body--row.row-green) {
    background-color: rgb(255, 255, 225); // color: #fff;
  }

  :deep(.el-row) {
    display: block;
  }
  .spacer {
    // width:350px;
    margin-top: 3px;
    margin-bottom: 10px;
    display: flex;
  }

  .transitionPane {
    transition: width 0.5s;
  }

  .saveButton {
    margin: 0 !important;
  }

  .tagboxborder {
    border: 1px solid #27b46b;
    color: #27b46b;
  }

  .el-dialog {
    :deep(.el-dialog__body) {
      padding: 0 !important;
    }
  }
}

:deep(.tool-tip-box) {
  width: 300px;
}
.tool-tip-box {
  width: 300px;
}
</style>
